<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Meta, title, CSS, favicons, etc. -->
    <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="An extended Bootstrap table with radio, checkbox, sort, pagination, and other added features.">
<meta name="keywords" content="table, bootstrap, bootstrap plugin, bootstrap resources, bootstrap table, jQuery plugin">
<meta name="author" content="Zhixin Wen, and Bootstrap table contributors">

<title>
  
    Getting started &middot; Bootstrap Table
  
</title>

<!-- Bootstrap CSS -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap-theme.min.css" rel="stylesheet">
<link href="https://unpkg.com/bootstrap-table@1.12.2/dist/bootstrap-table.min.css" rel="stylesheet">
<link href="../assets/css/docs.min.css" rel="stylesheet">
<link href="../assets/css/sidenav.css?v=1.12.2" rel="stylesheet">
<link href="../assets/css/style.css?v=1.12.2&m=1" rel="stylesheet">
<link href="../assets/css/ads.css" rel="stylesheet">

<!--[if lt IE 9]><script src="../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<script src="../assets/js/ie-emulation-modes-warning.js"></script>

<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->

<!-- Favicons -->
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="icon" href="/favicon.ico">

<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
  ga('create', 'UA-36708951-1', 'wenzhixin.net.cn');
  ga('send', 'pageview');
</script>

<script type="text/javascript">
    if (window!=top) // 判断当前的window对象是否是top对象
        top.location.href = window.location.href; // 如果不是，将top对象的网址自动导向被嵌入网页的网址
</script>

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

<!-- 将此标记放置在 head 中，或放置在结束 body 标记之前，并使其紧邻此标记。 -->
<script src="https://apis.google.com/js/platform.js" async defer></script>

  </head>
  <body>
    <a class="sr-only sr-only-focusable" href="#content">Skip to main content</a>

    <!-- Docs master nav -->
    <header class="navbar navbar-static-top bs-docs-nav" id="top" role="banner">
    <div class="container">
        <div class="navbar-header">
            <button class="navbar-toggle collapsed" type="button" data-toggle="collapse"
                    data-target=".bs-navbar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a href="../home/" class="navbar-brand">Bootstrap Table</a>
        </div>
        <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
            <ul class="nav navbar-nav">
                <li  class="active">
                    <a href="../getting-started/">Getting started</a>
                </li>
                <li >
                    <a href="../documentation/">Documentation</a>
                </li>
                <li class="dropdown" >
                    <a href="javascript:" data-toggle="dropdown">
                        Examples
                        <span class="caret"></span>
                    </a>
                    <ul class="dropdown-menu">
                        <li><a href="http://issues.wenzhixin.net.cn/bootstrap-table/" target="_blank">Examples</a></li>
                        <li><a href="https://github.com/wenzhixin/bootstrap-table/issues/1765">jsFiddle Examples</a></li>
                    </ul>
                </li>
                <li >
                    <a href="../extensions/">Extensions</a>
                </li>
                <li >
                    <a href="../donate/">Donate</a>
                </li>
                <li >
                    <a href="../faq/">FAQ</a>
                </li>
                <li>
                    <a href="https://github.com/wenzhixin/bootstrap-table" target="_blank">GitHub</a>
                </li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <!-- Localization -->
                <li>
                    <a href="javascript:void(0)" class="dropdown-toggle" data-toggle="dropdown">
                        <span class="language">English</span> <span class="caret"></span>
                    </a>
                    <ul class="dropdown-menu">
                        
                        <li data-language="en">
                            <a href="javascript:void(0)">
                                English
                            </a>
                        </li>
                        
                        <li data-language="zh-cn">
                            <a href="javascript:void(0)">
                                简体中文
                            </a>
                        </li>
                        
                        <li data-language="es">
                            <a href="javascript:void(0)">
                                Español
                            </a>
                        </li>
                        
                    </ul>
                </li>
            </ul>
        </nav>
    </div>
</header>


    <!-- Docs page layout -->
    <div class="bs-docs-header" id="content">
      <div class="container">
        <div class="row">
          <div class="col-md-9">
            <h1>Getting started</h1>
            <div>An overview of Bootstrap Table, how to download and use, basic templates, and more.</div>
          </div>
          <div class="col-md-3">
            <script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?serve=CK7DE27Y&placement=bootstrap-tablewenzhixinnetcn" id="_carbonads_js"></script>

          </div>
        </div>
      </div>
    </div>

    <div class="bs-docs-social">
    If you like bootstrap table: 
    <ul class="bs-docs-social-buttons">
        <li>
            <iframe class="github-btn"
                    src="http://ghbtns.com/github-btn.html?user=wenzhixin&repo=bootstrap-table&type=watch&count=true"
                    width="100" height="20" title="Star on GitHub"></iframe>
        </li>
        <li>
            <iframe class="github-btn"
                    src="http://ghbtns.com/github-btn.html?user=wenzhixin&repo=bootstrap-table&type=fork&count=true"
                    width="102" height="20" title="Fork on GitHub"></iframe>
        </li>
        <li>
            <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=wenzhixin&type=follow&count=true"
                    width="175" height="20" title="Follow on GitHub"></iframe>
        </li>
        <!--<li>-->
            <!-- https://about.twitter.com/resources/buttons#tweet -->
            <!--<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://wenzhixin.net.cn/p/bootstrap-table" data-via="BootstrapTable" data-related="BootstrapTable">Tweet</a>-->
        <!--</li>-->
        <!--<li>-->
             <!--将此标记放置在你希望显示+1 按钮的位置。 -->
            <!--<div class="g-plusone" data-annotation="inline" data-width="120"></div>-->
        <!--</li>-->
        <!--<li>-->
            <!--<div>QQ group:  103558783</div>-->
        <!--</li>-->
    </ul>
    Questions/Helps: 
    <ul class="bs-docs-social-buttons">
        <li>
            <a class="help-btn" href="http://stackoverflow.com/questions/tagged/bootstrap-table">StackOverflow</a>
        </li>
        <li>
            <a class="help-btn" href="http://segmentfault.com/t/bootstrap-table">SegmentFault</a>
        </li>
    </ul>
</div>


    <hr>

    <div class="container bs-docs-container">

      <div class="row">
        <div class="col-md-9"
             role="main"
             data-toggle="sidenav"
             data-container="#sidenav"
             data-hs="h1,h2"
             data-smart-id="true"
             data-bottom=".bs-docs-footer">
          <h1>Download <a href="https://github.com/wenzhixin/bootstrap-table/blob/develop/docs/_i18n/en/getting-started/download.md"></a></h1>

<p><hr></p>

<p class="lead">
Bootstrap table (currently v1.12.2) has a few easy ways to quickly get started, each one appealing to a different skill level and use case. Read through to see what suits your particular needs.
</p>

<h2>Source code</h2>

<p>Source css, JavaScript, locales, and extensions, along with our docs.</p>

<p><a href="https://github.com/wenzhixin/bootstrap-table/archive/master.zip" class="btn btn-lg btn-outline" role="button">Download source</a></p>

<h2>Clone or fork via GitHub</h2>

<p><a href="https://github.com/wenzhixin/bootstrap-table" class="btn btn-lg btn-outline" role="button">Via GitHub</a></p>

<h2>CDN</h2>

<p>The folks over at <a href="http://www.cdnjs.com/libraries/bootstrap-table">CDNJS</a> and <a href="http://open.bootcss.com/bootstrap-table/">bootcss</a> graciously provide CDN support for CSS and JavaScript of Bootstrap table. Just use these CDN links.</p>

<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="c">&lt;!-- Latest compiled and minified CSS --&gt;</span>
<span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">"stylesheet"</span> <span class="na">href=</span><span class="s">"//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.12.2/bootstrap-table.min.css"</span><span class="nt">&gt;</span>

<span class="c">&lt;!-- Latest compiled and minified JavaScript --&gt;</span>
<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">"//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.12.2/bootstrap-table.min.js"</span><span class="nt">&gt;&lt;/script&gt;</span>

<span class="c">&lt;!-- Latest compiled and minified Locales --&gt;</span>
<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">"//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.12.2/locale/bootstrap-table-zh-CN.min.js"</span><span class="nt">&gt;&lt;/script&gt;</span>
</code></pre></div>

<h2>Bower</h2>

<p>Install and manage Bootstrap table&#39;s CSS, JavaScript, locales, and extensions using <a href="http://bower.io/">Bower</a>.</p>

<div class="highlight"><pre><code class="language-bash" data-lang="bash"><span class="nv">$ </span>bower <span class="nb">install </span>bootstrap-table
</code></pre></div>

<h1>What&#39;s included <a href="https://github.com/wenzhixin/bootstrap-table/blob/develop/docs/_i18n/en/getting-started/whats-include.md"></a></h1>

<p><hr></p>

<p>The Bootstrap table source code download includes the precompiled CSS, JavaScript, locales, extensions, and provides both compiled and minified variations, along with documentation. More specifically, it includes the following and more:</p>

<div class="highlight"><pre><code class="language-bash" data-lang="bash">bootstrap-table/
├── dist/
│   ├── extensions/
│   ├── locale/
│   ├── bootstrap-table.min.css
│   └── bootstrap-table.min.js
├── docs/
└── src/
    ├── extensions/
    ├── locale/
    ├── bootstrap-table.css
    └── bootstrap-table.js
</code></pre></div>

<p>The <code>src/</code>, <code>locale/</code>, and <code>extensions/</code> are the source code for our CSS, JS. The <code>dist/</code> folder includes everything compiled and minified with <code>src/</code>. The <code>docs/</code> folder includes the source code for our documentation. Beyond that, any other included file provides support for packages, license information, and development.</p>

<h1>Compiling CSS and JavaScript <a href="https://github.com/wenzhixin/bootstrap-table/blob/develop/docs/_i18n/en/getting-started/grunt.md"></a></h1>

<p><hr></p>

<p>Bootstrap table uses <a href="http://gruntjs.com/">Grunt</a> for its build system, with convenient methods for working with the framework. It&#39;s how we compile our code, run tests, and more.</p>

<h2>Installing Grunt</h2>

<p>To install Grunt, you must <strong>first</strong> <a href="http://nodejs.org/download/">download and install node.js</a> (which includes npm). npm stands for <a href="http://npmjs.org/">node packaged modules</a> and is a way to manage development dependencies through node.js.</p>

<p>Then, from the command line:</p>

<ol>
<li>Navigate to the root <code>/bootstrap-table/</code> directory, then run <code>npm install</code>. npm will look at the <code>package.json</code> file and automatically install the necessary local dependencies listed there.</li>
</ol>

<p>When completed, you&#39;ll be able to run the various Grunt commands provided from the command line.</p>

<h2>Available Grunt commands</h2>

<h3><code>npm run grunt docs</code> (Build &amp; test the docs assets)</h3>

<p>Builds and tests CSS, JavaScript, and other assets which are used when running the documentation locally via <code>jekyll serve</code>.</p>

<h3><code>npm run grunt</code> (Build absolutely everything and run tests)</h3>

<p>Compiles and minifies CSS and JavaScript, builds the documentation website, runs the HTML5 validator against the docs, regenerates the Customizer assets, and more. Requires <a href="http://jekyllrb.com/docs/installation/">Jekyll</a>.</p>

<h2>Troubleshooting</h2>

<p>Should you encounter problems with installing dependencies or running Grunt commands, first delete the <code>/node_modules/</code> directory generated by npm. Then, rerun <code>npm install</code>.</p>

<h1>Usage <a href="https://github.com/wenzhixin/bootstrap-table/blob/develop/docs/_i18n/en/getting-started/usage.md"></a></h1>

<p><hr></p>

<p>Include Bootstrap library (if your project doesn&#39;t use it already) and <code>bootstrap-table.css</code> in the head tag your html document.</p>

<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">"stylesheet"</span> <span class="na">href=</span><span class="s">"bootstrap.min.css"</span><span class="nt">&gt;</span>
<span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">"stylesheet"</span> <span class="na">href=</span><span class="s">"bootstrap-table.css"</span><span class="nt">&gt;</span>
</code></pre></div>

<p>Include jQuery library, bootstrap library (if your project doesn&#39;t use it already) and <code>bootstrap-table.js</code> in the head tag or at the very bottom of your document, just before the closing body tag (usually recommended for better performance).</p>

<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;script </span><span class="na">src=</span><span class="s">"jquery.min.js"</span><span class="nt">&gt;&lt;/script&gt;</span>
<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">"bootstrap.min.js"</span><span class="nt">&gt;&lt;/script&gt;</span>
<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">"bootstrap-table.js"</span><span class="nt">&gt;&lt;/script&gt;</span>
<span class="nt">&lt;--</span> <span class="na">put</span> <span class="na">your</span> <span class="na">locale</span> <span class="na">files</span> <span class="na">after</span> <span class="na">bootstrap-table</span><span class="err">.</span><span class="na">js</span> <span class="na">--</span><span class="nt">&gt;</span>
<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">"bootstrap-table-zh-CN.js"</span><span class="nt">&gt;&lt;/script&gt;</span>
</code></pre></div>

<p><hr></p>

<p>The Bootstrap Table plugin displays data in a tabular format, via data attributes or JavaScript.</p>

<h2>Via data attributes</h2>

<p>Activate bootstrap table without writing JavaScript. Set <code>data-toggle=&quot;table&quot;</code> on a normal table.</p>

<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;table</span> <span class="na">data-toggle=</span><span class="s">"table"</span><span class="nt">&gt;</span>
    <span class="nt">&lt;thead&gt;</span>
        <span class="nt">&lt;tr&gt;</span>
            <span class="nt">&lt;th&gt;</span>Item ID<span class="nt">&lt;/th&gt;</span>
            <span class="nt">&lt;th&gt;</span>Item Name<span class="nt">&lt;/th&gt;</span>
            <span class="nt">&lt;th&gt;</span>Item Price<span class="nt">&lt;/th&gt;</span>
        <span class="nt">&lt;/tr&gt;</span>
    <span class="nt">&lt;/thead&gt;</span>
    <span class="nt">&lt;tbody&gt;</span>
        <span class="nt">&lt;tr&gt;</span>
            <span class="nt">&lt;td&gt;</span>1<span class="nt">&lt;/td&gt;</span>
            <span class="nt">&lt;td&gt;</span>Item 1<span class="nt">&lt;/td&gt;</span>
            <span class="nt">&lt;td&gt;</span>$1<span class="nt">&lt;/td&gt;</span>
        <span class="nt">&lt;/tr&gt;</span>
        <span class="nt">&lt;tr&gt;</span>
            <span class="nt">&lt;td&gt;</span>2<span class="nt">&lt;/td&gt;</span>
            <span class="nt">&lt;td&gt;</span>Item 2<span class="nt">&lt;/td&gt;</span>
            <span class="nt">&lt;td&gt;</span>$2<span class="nt">&lt;/td&gt;</span>
        <span class="nt">&lt;/tr&gt;</span>
    <span class="nt">&lt;/tbody&gt;</span>
<span class="nt">&lt;/table&gt;</span>
</code></pre></div>

<p>We can also use remote url data by setting <code>data-url=&quot;data1.json&quot;</code> on a normal table.</p>

<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;table</span> <span class="na">data-toggle=</span><span class="s">"table"</span> <span class="na">data-url=</span><span class="s">"data1.json"</span><span class="nt">&gt;</span>
    <span class="nt">&lt;thead&gt;</span>
        <span class="nt">&lt;tr&gt;</span>
            <span class="nt">&lt;th</span> <span class="na">data-field=</span><span class="s">"id"</span><span class="nt">&gt;</span>Item ID<span class="nt">&lt;/th&gt;</span>
            <span class="nt">&lt;th</span> <span class="na">data-field=</span><span class="s">"name"</span><span class="nt">&gt;</span>Item Name<span class="nt">&lt;/th&gt;</span>
            <span class="nt">&lt;th</span> <span class="na">data-field=</span><span class="s">"price"</span><span class="nt">&gt;</span>Item Price<span class="nt">&lt;/th&gt;</span>
        <span class="nt">&lt;/tr&gt;</span>
    <span class="nt">&lt;/thead&gt;</span>
<span class="nt">&lt;/table&gt;</span>
</code></pre></div>

<p>You can also add <code>pagination</code>, <code>search</code>, and <code>sorting</code> to a table like the following table.</p>

<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;table</span> <span class="na">data-pagination=</span><span class="s">"true"</span> <span class="na">data-search=</span><span class="s">"true"</span> <span class="na">data-toggle=</span><span class="s">"table"</span> <span class="na">data-url=</span><span class="s">"data1.json"</span><span class="nt">&gt;</span>
    <span class="nt">&lt;thead&gt;</span>
        <span class="nt">&lt;tr&gt;</span>
            <span class="nt">&lt;th</span> <span class="na">data-sortable=</span><span class="s">"true"</span> <span class="na">data-field=</span><span class="s">"id"</span><span class="nt">&gt;</span>Item ID<span class="nt">&lt;/th&gt;</span>
            <span class="nt">&lt;th</span> <span class="na">data-field=</span><span class="s">"name"</span><span class="nt">&gt;</span>Item Name<span class="nt">&lt;/th&gt;</span>
            <span class="nt">&lt;th</span> <span class="na">data-field=</span><span class="s">"price"</span><span class="nt">&gt;</span>Item Price<span class="nt">&lt;/th&gt;</span>
        <span class="nt">&lt;/tr&gt;</span>
    <span class="nt">&lt;/thead&gt;</span>
<span class="nt">&lt;/table&gt;</span>
</code></pre></div>

<h2>Via JavaScript</h2>

<p>Call a bootstrap table with id table with JavaScript.</p>

<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;table</span> <span class="na">id=</span><span class="s">"table"</span><span class="nt">&gt;&lt;/table&gt;</span>
</code></pre></div><div class="highlight"><pre><code class="language-js" data-lang="js"><span class="nx">$</span><span class="p">(</span><span class="s1">'#table'</span><span class="p">).</span><span class="nx">bootstrapTable</span><span class="p">({</span>
    <span class="na">columns</span><span class="p">:</span> <span class="p">[{</span>
        <span class="na">field</span><span class="p">:</span> <span class="s1">'id'</span><span class="p">,</span>
        <span class="na">title</span><span class="p">:</span> <span class="s1">'Item ID'</span>
    <span class="p">},</span> <span class="p">{</span>
        <span class="na">field</span><span class="p">:</span> <span class="s1">'name'</span><span class="p">,</span>
        <span class="na">title</span><span class="p">:</span> <span class="s1">'Item Name'</span>
    <span class="p">},</span> <span class="p">{</span>
        <span class="na">field</span><span class="p">:</span> <span class="s1">'price'</span><span class="p">,</span>
        <span class="na">title</span><span class="p">:</span> <span class="s1">'Item Price'</span>
    <span class="p">}],</span>
    <span class="na">data</span><span class="p">:</span> <span class="p">[{</span>
        <span class="na">id</span><span class="p">:</span> <span class="mi">1</span><span class="p">,</span>
        <span class="na">name</span><span class="p">:</span> <span class="s1">'Item 1'</span><span class="p">,</span>
        <span class="na">price</span><span class="p">:</span> <span class="s1">'$1'</span>
    <span class="p">},</span> <span class="p">{</span>
        <span class="na">id</span><span class="p">:</span> <span class="mi">2</span><span class="p">,</span>
        <span class="na">name</span><span class="p">:</span> <span class="s1">'Item 2'</span><span class="p">,</span>
        <span class="na">price</span><span class="p">:</span> <span class="s1">'$2'</span>
    <span class="p">}]</span>
<span class="p">});</span>
</code></pre></div>

<p>We can also use remote url data by setting <code>url: &#39;data1.json&#39;</code>.</p>

<div class="highlight"><pre><code class="language-js" data-lang="js"><span class="nx">$</span><span class="p">(</span><span class="s1">'#table'</span><span class="p">).</span><span class="nx">bootstrapTable</span><span class="p">({</span>
    <span class="na">url</span><span class="p">:</span> <span class="s1">'data1.json'</span><span class="p">,</span>
    <span class="na">columns</span><span class="p">:</span> <span class="p">[{</span>
        <span class="na">field</span><span class="p">:</span> <span class="s1">'id'</span><span class="p">,</span>
        <span class="na">title</span><span class="p">:</span> <span class="s1">'Item ID'</span>
    <span class="p">},</span> <span class="p">{</span>
        <span class="na">field</span><span class="p">:</span> <span class="s1">'name'</span><span class="p">,</span>
        <span class="na">title</span><span class="p">:</span> <span class="s1">'Item Name'</span>
    <span class="p">},</span> <span class="p">{</span>
        <span class="na">field</span><span class="p">:</span> <span class="s1">'price'</span><span class="p">,</span>
        <span class="na">title</span><span class="p">:</span> <span class="s1">'Item Price'</span>
    <span class="p">},</span> <span class="p">]</span>
<span class="p">});</span>
</code></pre></div>

        </div>
        
        <div class="col-md-3">
          <div id="sidenav"></div>
        </div>
        
      </div>
    </div>

    <!-- Footer
================================================== -->
<footer class="bs-docs-footer" role="contentinfo">
  <div class="container">
    <div class="bs-docs-social">
    If you like bootstrap table: 
    <ul class="bs-docs-social-buttons">
        <li>
            <iframe class="github-btn"
                    src="http://ghbtns.com/github-btn.html?user=wenzhixin&repo=bootstrap-table&type=watch&count=true"
                    width="100" height="20" title="Star on GitHub"></iframe>
        </li>
        <li>
            <iframe class="github-btn"
                    src="http://ghbtns.com/github-btn.html?user=wenzhixin&repo=bootstrap-table&type=fork&count=true"
                    width="102" height="20" title="Fork on GitHub"></iframe>
        </li>
        <li>
            <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=wenzhixin&type=follow&count=true"
                    width="175" height="20" title="Follow on GitHub"></iframe>
        </li>
        <!--<li>-->
            <!-- https://about.twitter.com/resources/buttons#tweet -->
            <!--<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://wenzhixin.net.cn/p/bootstrap-table" data-via="BootstrapTable" data-related="BootstrapTable">Tweet</a>-->
        <!--</li>-->
        <!--<li>-->
             <!--将此标记放置在你希望显示+1 按钮的位置。 -->
            <!--<div class="g-plusone" data-annotation="inline" data-width="120"></div>-->
        <!--</li>-->
        <!--<li>-->
            <!--<div>QQ group:  103558783</div>-->
        <!--</li>-->
    </ul>
    Questions/Helps: 
    <ul class="bs-docs-social-buttons">
        <li>
            <a class="help-btn" href="http://stackoverflow.com/questions/tagged/bootstrap-table">StackOverflow</a>
        </li>
        <li>
            <a class="help-btn" href="http://segmentfault.com/t/bootstrap-table">SegmentFault</a>
        </li>
    </ul>
</div>


    <p>Designed and built with all the love in the world by <a href="https://github.com/wenzhixin" target="_blank">@wenzhixin</a>.</p>
    <p>Maintained by <a href="https://github.com/wenzhixin" target="_blank">@wenzhixin</a> with the help of <a href="https://github.com/wenzhixin/bootstrap-table/graphs/contributors" target="_blank">our contributors</a>.</p>
    <p>Code licensed under <a href="https://github.com/wenzhixin/bootstrap-table/blob/master/LICENSE" target="_blank">MIT</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
    <ul class="bs-docs-footer-links muted">
      <li>Currently v1.12.2</li>
      <li>&middot;</li>
      <li><a href="https://github.com/wenzhixin/bootstrap-table">GitHub</a></li>
      <li>&middot;</li>
      <li><a href="http://wenzhixin.net.cn">My website</a></li>
      <li>&middot;</li>
      <li><a href="http://repos.wenzhixin.net.cn">My repos</a></li>
      <li>&middot;</li>
      <li><a href="http://stackoverflow.com/questions/tagged/bootstrap-table">Questions / Helps</a></li>
      <li>&middot;</li>
      <li><a href="https://github.com/wenzhixin/bootstrap-table/issues">Issues</a></li>
      <li>&middot;</li>
      <li><a href="https://github.com/wenzhixin/bootstrap-table/releases">Releases</a></li>
      <li>&middot;</li>
      <li><a href="mailto:wenzhixin2010@gmail.com">Email</a></li>
    </ul>
  </div>
</footer>


<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://unpkg.com/bootstrap-table@1.12.2/dist/bootstrap-table.min.js"></script>
<script src="https://unpkg.com/bootstrap-table@1.12.2/dist/extensions/mobile/bootstrap-table-mobile.js"></script>

<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="../assets/js/ie10-viewport-bug-workaround.js"></script>

<script src="../assets/js/sidenav.js?v=1.12.2"></script>
<script src="../assets/js/common.js?v=1.12.2"></script>

  </body>
</html>
